const {
    default: axios
} = require('../lib/axios/axios')

require('../less/sportsData.less')
require('../fonts/iconfont.css')


document.ready(function () {

    //加载导航守卫
    utils.navGuard()

    // 返回按钮
    const goBack = document.querySelector('#goBack')
    //总运动
    const allSporstTime = document.querySelector('.allSporstTime')
    //总消耗
    const allConsume = document.querySelector('.allConsume')
    //消耗千卡
    const consumeText = document.querySelector('.consumeText')
    //累计天数
    const addupText = document.querySelector('.addupText')
    // 连续天数
    const continuousText = document.querySelector('.continuousText')
    //用户头像
    const userImg = document.querySelector('.userImg')
    const userInfo = JSON.parse(localStorage.getItem('userInfo'))

    userImg.src = 'http://139.9.177.51:8099/' + userInfo.imgurl

    goBack.addEventListener('click', function () {
        window.location.href = 'mine.html'
    })
    // 定义时间数组
    let timearr = [];
    //定义运动时间数字
    let sportstime = [];
    // 饼图数组
    const pieArr = [];

    // 柱状图
    function bar() {
        var myChart = echarts.init(document.querySelector('.bar'));
        const option = {
            title: {
                text: '近7日运动时长'
            },
            grid: {
                height: '100px'
            },
            xAxis: {
                type: 'category',
                data: timearr,

            },
            yAxis: {
                name: '时间',
                type: 'value'
            },
            series: [{
                data: sportstime,
                type: 'bar'
            }]
        };

        myChart.setOption(option);
    }


    function pie() {
        var myChart = echarts.init(document.querySelector('.pie'));
        const option = {
            tooltip: {
                trigger: 'item'
            },
            legend: {
                top: '5%',
                left: 'center'
            },
            series: [{
                name: '访问来源',
                type: 'pie',
                radius: ['40%', '70%'],
                avoidLabelOverlap: true,
                top: 20,
                itemStyle: {
                    borderRadius: 10,
                    borderColor: '#fff',
                    borderWidth: 2,
                    normal: {
                        label: {
                            show: true,
                            formatter: '{b}\n{c}\n({d}%)'
                        },
                        labelLine: {
                            show: true
                        }
                    }
                },
                label: {
                    show: false,
                    position: 'center'
                },
                emphasis: {
                    label: {
                        show: true,
                        fontSize: '20',
                        // fontWeight: 'bold'
                    }
                },
                labelLine: {
                    show: true
                },
                data: [{
                        value: pieArr[0],
                        name: '跑步'
                    },
                    {
                        value: pieArr[2],
                        name: '骑行'
                    },
                    {
                        value: pieArr[1],
                        name: '训练'
                    },
                ]
            }]
        };
        myChart.setOption(option);

    }

    axios.get(`${url}/sports/exerciseData?id=${localStorage.getItem('userId')}`)
        .then(function (res) {
            res = res.data
            if (res.status == 0) {
                consumeText.textContent = allConsume.textContent = Math.floor(res.data.calorie)
                allSporstTime.textContent = Math.floor(res.data.times)
            }


        })
        .catch(function (error) {
            console.log(error)
        })

    // 处理运动数据 渲染图表  使用axios
    axios.get(`${url}/sport/data/${localStorage.getItem('userId')}`)
        .then(function (res) {
            //筛选出数据
            res = res.data
            if (res.status == 0) {

                console.log(res)
                //先渲染   运动天数
                addupText.textContent = res.data.sumDays
                continuousText.textContent = res.data.continueDays


                const arrDay = res.data.days
                // 时间  渲染柱状图
                timearr = arrDay.map((item) => item.date.substr(5))
                sportstime = arrDay.map((item) => item.dayTimes)
                console.log('timerr >> ', timearr)
                console.log('sportstime :>> ', sportstime)
                // 渲染前五天数据
                if (timearr.length >= 5) {
                    const len = timearr.length - 5
                    timearr = timearr.filter(function (value, index) {
                        if (index >= len) {
                            return value
                        }
                    })
                }
                // 汇总所有数据
                const arrAll = arrDay.map((item) => item.exerciseData).flat(Infinity);
                console.log(arrAll)

                // 过滤数据
                const arrRun = arrAll.filter((item) => item.type == "跑步")
                const arrdrill = arrAll.filter((item) => item.type == "训练")
                const arrRiding = arrAll.filter((item) => item.type == '骑行')
                console.log(arrRun)
                console.log(arrdrill)
                console.log('arrRiding :>> ', arrRiding)

                // 计算跑步次数
                const runsum = arrRun.map((item) => item.numberoftimes)
                //计算训练次数
                const drillsum = arrdrill.map((item) => item.numberoftimes)
                //计算骑行次数
                const ridingsum = arrRiding.map((item) => item.numberoftimes)
                const a = runsum.reduce((a, b) => {
                    b = Number(a) + Number(b)
                    return b

                })
                const b = drillsum.reduce((a, b) => {
                    b = Number(a) + Number(b)
                    return b
                })
                const c = ridingsum.reduce((a, b) => {
                    b = Number(a) + Number(b)
                    return b
                })
                pieArr.push(a, b, c)


                bar()
                pie()

            }
        })
        .catch(function (error) {
            console.log(error)
        })






    // 处理运动数据 渲染图表

    // $http.get(`/sport/data/${localStorage.getItem('userId')}`, function (res) {
    //     if (res.status == 0) {

    //         const arrDay = res.data.days
    //         // 时间  渲染柱状图
    //         timearr = arrDay.map((item) => item.date.substr(5))
    //         sportstime = arrDay.map((item) => item.dayTimes)
    //         // 测试
    //         if (timearr.length >= 5) {
    //             const len = timearr.length - 5
    //             timearr = timearr.filter(function (value, index) {
    //                 if (index >= len) {
    //                     return value
    //                 }
    //             })
    //         }
    //         // 汇总所有数据
    //         const arrAll = arrDay.map((item) => item.exerciseData).flat(Infinity);

    //         // 过滤数据
    //         const arrRun = arrAll.filter((item) => item.type == "跑步")
    //         const arrdrill = arrAll.filter((item) => item.type == "训练")
    //         console.log(arrRun)
    //         console.log(arrdrill)

    //         // 计算跑步次数
    //         const runsum = arrRun.map((item) => item.numberoftimes)
    //         //计算训练次数
    //         const drillsum = arrdrill.map((item) => item.numberoftimes)
    //         const a = runsum.reduce((a, b) => {

    //             b = Number(a) + Number(b)

    //             return b

    //         })
    //         const b = drillsum.reduce((a, b) => {
    //             b = Number(a) + Number(b)
    //             return b
    //         })
    //         pieArr.push(a, b)


    //         bar()
    //         pie()

    //     }
    // })














})